// head保养管理（扫枪）
<template>
  <div>
    <div class="filter-container">
      <el-form ref="form" :inline="true" size="small">
        <el-form-item label="HeadSN" prop="headSN">
          <el-select v-model="headSN" placeholder="请选择,可搜索" filterable remote :clearable="true" :loading="loading"
            :remote-method="filterHeadSN">
            <el-option v-for="item in selectList" :key="item.id" :label="item.headSN" :value="item.headSN"></el-option>
            <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
              :current-page.sync="page" :page-sizes="[10, 20, 30, 50]" :page-size="limit"
              layout="total, sizes, prev, pager, next" :total="count"></el-pagination>
          </el-select>
        </el-form-item>
        <el-form-item label="年份" prop="year">
          <el-select v-model="year" filterable placeholder="请选择">
            <el-option v-for="item in yearList" :key="item.value" :label="item.label" :value="item.label"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="handleSearchHeadSN1">搜索</el-button>
        </el-form-item>
      </el-form>
      <div class="HeadSN">扫描HeadSN:<span class="headsn">{{ formModel.headSN || '&lt;无&gt;' }}</span></div>
      <div>(当前页面可直接扫抢扫码查询HeadSN和登记保养记录 || "点击选中"后可扫抢扫码登记对应保养类型[周/月/季/年]的Header保养记录)</div>
      <!-- table -->
      <!-- 周保养 -->
      <!-- <el-row>
        <el-col :span="2">
          <div class="button" :style="getBgStyle(showWeekTableLight)">
            <el-button type="primary" size="small" @click="handleWeekTableLight">点击选中</el-button>
          </div>
        </el-col>
          <el-col :span="2">
            <div class="container">
              <div :style="getBgStyle(showWeekTableLight,true)">周保养</div>
            </div>
          </el-col>
          <el-col :span="2">
            <div>
              <div class="mainteDay" :style="getBgStyle(showWeekTableLight,true)">
                <div class="mainteDay1">距离下次保养天数</div>
                <div class="mainteDayText">{{ this.weekNextMainteRemainDays }}</div>
              </div>
              <span></span>
            </div>
          </el-col>
        <el-col :span="18">
          <div class="tableMargin">
            <el-table style="width: 100%" :data="weekValues" :cell-style="cellWeekStyleEvent"
              :cell-class-name="tableCellClassName" @cell-click="cellWeekClick" :show-header="false">
              <el-table-column width="160" v-for="(item, index) in weekHeaders" show-overflow-tooltip :key="index"
                align="center">
                <template v-slot="scope">
                  保养时间
                  <div v-if="(scope.row.index == 0 || scope.row.index == 1 || scope.row.index == 2 || scope.row.index == 3)">
                    <div v-if="scope.row.index == 0">
                      <el-input v-model="weekFormModel.mainteDate" type="date"
                        v-if="scope.row.index == weekCoordinate.row && scope.column.index == weekCoordinate.column && scope.column.index !== 0 && inputWeekVisible"
                        @blur="handleWeekEdit(scope.$index, scope.row)" ref="editWeekInput"></el-input>
                      <template v-else>{{ scope.row[item] }}</template>
</div>
保养员工
<div v-if="scope.row.index == 1">
  <el-input v-model="weekFormModel.mainteEmpNo"
    v-if="scope.row.index == weekCoordinate.row && scope.column.index == weekCoordinate.column && scope.column.index !== 0 && inputWeekVisible"
    @blur="handleWeekEdit(scope.$index, scope.row)" ref="editWeekInput"></el-input>
  <template v-else>{{ scope.row[item] }}</template>
</div>
<div v-if="scope.row.index == 2">
  <el-input v-model="weekFormModel.mainteEmpName"
    v-if="scope.row.index == weekCoordinate.row && scope.column.index == weekCoordinate.column && scope.column.index !== 0 && inputWeekVisible"
    @blur="handleWeekEdit(scope.$index, scope.row)" ref="editWeekInput"></el-input>
  <template v-else>{{ scope.row[item] }}</template>
</div>
备注信息
<div v-if="scope.row.index == 3">
  <el-input v-model="weekFormModel.mainteMark"
    v-if="scope.row.index == weekCoordinate.row && scope.column.index == weekCoordinate.column && scope.column.index !== 0 && inputWeekVisible"
    @blur="handleWeekEdit(scope.$index, scope.row)" ref="editWeekInput"></el-input>
  <template v-else>{{ scope.row[item] }}</template>
</div>
</div>
<div v-else>{{ scope.row[item] }}</div>
</template>
</el-table-column>
</el-table>
</div>
</el-col>
</el-row>
<br> -->
      <!-- 月保养 -->
      <el-row>
        <el-col :span="2">
          <div class="button" :style="getBgStyle(showMonthTableLight)">
            <el-button type="primary" size="small" @click="handleMonthTableLight">点击选中</el-button>
          </div>
        </el-col>
        <el-col :span="2">
          <div class="container">
            <div :style="getBgStyle(showMonthTableLight, true)">月保养</div>
          </div>
        </el-col>
        <el-col :span="2">
          <div>
            <div class="mainteDay" :style="getBgStyle(showMonthTableLight, true)">
              <div class="mainteDay1">距离下次保养天数</div>
              <div class="mainteDayText">{{ this.monthNextMainteRemainDays }}</div>
            </div>
            <span></span>
          </div>
        </el-col>
        <el-col :span="18" class="tableMargin">
          <el-table style="width: 100%" :data="monthValues" :cell-style="cellMonthStyleEvent"
            :cell-class-name="tableCellClassName" @cell-click="cellMonthClick" :show-header="false">
            <el-table-column width="160" show-overflow-tooltip v-for="(item, index) in monthHeaders" :key="index"
              align="center">
              <template v-slot="scope">
                <!-- 保养时间 -->
                <div
                  v-if="scope.row.index == 0 || scope.row.index == 1 || scope.row.index == 2 || scope.row.index == 3">
                  <div v-if="scope.row.index == 0">
                    <el-input v-model="monthFormModel.mainteDate" type="date"
                      v-if="scope.row.index == monthCoordinate.row && scope.column.index == monthCoordinate.column && scope.column.index !== 0 && inputMonthVisible"
                      @blur="handleMonthEdit(scope.$index, scope.row)" ref="editInput"></el-input>
                    <template v-else>{{ scope.row[item] }}</template>
                  </div>
                  <!-- 保养员工 -->
                  <div v-if="scope.row.index == 1">
                    <el-input v-model="monthFormModel.mainteEmpNo"
                      v-if="scope.row.index == monthCoordinate.row && scope.column.index == monthCoordinate.column && scope.column.index !== 0 && inputMonthVisible"
                      @blur="handleMonthEdit(scope.$index, scope.row)" ref="editInput"></el-input>
                    <template v-else>{{ scope.row[item] }}</template>
                  </div>
                  <div v-if="scope.row.index == 2">
                    <el-input v-model="monthFormModel.mainteEmpName"
                      v-if="scope.row.index == monthCoordinate.row && scope.column.index == monthCoordinate.column && scope.column.index !== 0 && inputMonthVisible"
                      @blur="handleMonthEdit(scope.$index, scope.row)" ref="editInput"></el-input>
                    <template v-else>{{ scope.row[item] }}</template>
                  </div>
                  <!-- 备注信息 -->
                  <div v-if="scope.row.index == 3">
                    <el-input v-model="monthFormModel.mainteMark"
                      v-if="scope.row.index == monthCoordinate.row && scope.column.index == monthCoordinate.column && scope.column.index !== 0 && inputMonthVisible"
                      @blur="handleMonthEdit(scope.$index, scope.row)" ref="editInput"></el-input>
                    <template v-else>{{ scope.row[item] }}</template>
                  </div>
                </div>
                <div v-else>{{ scope.row[item] }}</div>
              </template>
            </el-table-column>
          </el-table>
        </el-col>
      </el-row>
      <br>
      <!-- 季保养 -->
      <el-row>
        <el-col :span="2">
          <div class="button" :style="getBgStyle(showQuarterTableLight)">
            <el-button type="primary" size="small" @click="handleQuarterTableLight">点击选中</el-button>
          </div>
        </el-col>
        <el-col :span="2">
          <div class="container">
            <div :style="getBgStyle(showQuarterTableLight, true)">季保养</div>
          </div>
        </el-col>
        <el-col :span="2">
          <div>
            <div class="mainteDay" :style="getBgStyle(showQuarterTableLight, true)">
              <div class="mainteDay1">距离下次保养天数</div>
              <div class="mainteDayText">{{ this.quarterNextMainteRemainDays }}</div>
            </div>
            <span></span>
          </div>
        </el-col>
        <el-col :span="18">
          <el-table style="width: 100%" :data="quarterValues" :cell-style="cellQuarterStyleEvent"
            :cell-class-name="tableCellClassName" @cell-click="cellQuarterClick" :show-header="false">
            <el-table-column width="160" show-overflow-tooltip v-for="(item, index) in quarterHeaders" :key="index"
              align="center">
              <template v-slot="scope">
                <!-- 保养时间 -->
                <div
                  v-if="scope.row.index == 0 || scope.row.index == 1 || scope.row.index == 2 || scope.row.index == 3">
                  <div v-if="scope.row.index == 0">
                    <el-input v-model="quarterFormModel.mainteDate" type="date"
                      v-if="scope.row.index == quarterCoordinate.row && scope.column.index == quarterCoordinate.column && scope.column.index !== 0 && inputQuarterVisible"
                      @blur="handleQuarterEdit(scope.$index, scope.row)" ref="editQuarterInput"></el-input>
                    <template v-else>{{ scope.row[item] }}</template>
                  </div>
                  <!-- 保养员工 -->
                  <div v-if="scope.row.index == 1">
                    <el-input v-model="quarterFormModel.mainteEmpNo"
                      v-if="scope.row.index == quarterCoordinate.row && scope.column.index == quarterCoordinate.column && scope.column.index !== 0 && inputQuarterVisible"
                      @blur="handleQuarterEdit(scope.$index, scope.row)" ref="editQuarterInput"></el-input>
                    <template v-else>{{ scope.row[item] }}</template>
                  </div>
                  <div v-if="scope.row.index == 2">
                    <el-input v-model="quarterFormModel.mainteEmpName"
                      v-if="scope.row.index == quarterCoordinate.row && scope.column.index == quarterCoordinate.column && scope.column.index !== 0 && inputQuarterVisible"
                      @blur="handleQuarterEdit(scope.$index, scope.row)" ref="editQuarterInput"></el-input>
                    <template v-else>{{ scope.row[item] }}</template>
                  </div>
                  <!-- 备注信息 -->
                  <div v-if="scope.row.index == 3">
                    <el-input v-model="quarterFormModel.mainteMark"
                      v-if="scope.row.index == quarterCoordinate.row && scope.column.index == quarterCoordinate.column && scope.column.index !== 0 && inputQuarterVisible"
                      @blur="handleQuarterEdit(scope.$index, scope.row)" ref="editQuarterInput"></el-input>
                    <template v-else>{{ scope.row[item] }}</template>
                  </div>
                </div>

                <div v-else>{{ scope.row[item] }}</div>
              </template>
            </el-table-column>
          </el-table>
        </el-col>
      </el-row>
      <!-- <br> -->
      <!-- 年保养 -->
      <!-- <el-row>
        <el-col :span="2">
          <div class="button" :style="getBgStyle(showYearTableLight)">
            <el-button type="primary" size="small" @click="handleYearTableLight">点击选中</el-button>
          </div>
        </el-col>
          <el-col :span="2">
            <div class="container">
              <div :style="getBgStyle(showYearTableLight,true)">年保养</div>
            </div>
          </el-col>
          <el-col :span="2">
            <div>
              <div class="mainteDay" :style="getBgStyle(showYearTableLight,true)">
                <div class="mainteDay1">距离下次保养天数</div>
                <div class="mainteDayText">{{ this.yearNextMainteRemainDays }}</div>
              </div>
              <span></span>
            </div>
          </el-col>
        <el-col :span="18">
          <el-table style="width: 100%" :data="yearValues" :cell-style="cellYearStyleEvent"
            :cell-class-name="tableCellClassName" @cell-click="cellYearClick" :show-header="false">
            <el-table-column width="160" show-overflow-tooltip v-for="(item, index) in yearHeaders" :key="index"
              align="center">
              <template v-slot="scope">
                 保养时间 
                <div v-if="scope.row.index == 0 || scope.row.index == 1 || scope.row.index == 2 || scope.row.index == 3">
                  <div v-if="scope.row.index == 0">
                    <el-input type="date" v-model="yearFormModel.mainteDate"
                      v-if="scope.row.index == yearCoordinate.row && scope.column.index == yearCoordinate.column && scope.column.index !== 0 && inputYearVisible"
                      @blur="handleYearEdit(scope.$index, scope.row)" ref="editYearInput"></el-input>
                    <template v-else>{{ scope.row[item] }}</template>
                  </div>
                   保养员工 
                  <div v-if="scope.row.index == 1">
                    <el-input v-model="yearFormModel.mainteEmpNo"
                      v-if="scope.row.index == yearCoordinate.row && scope.column.index == yearCoordinate.column && scope.column.index !== 0 && inputYearVisible"
                      @blur="handleYearEdit(scope.$index, scope.row)" ref="editYearInput"></el-input>
                    <template v-else>{{ scope.row[item] }}</template>
                  </div>
                  <div v-if="scope.row.index == 2">
                    <el-input v-model="yearFormModel.mainteEmpName"
                      v-if="scope.row.index == yearCoordinate.row && scope.column.index == yearCoordinate.column && scope.column.index !== 0 && inputYearVisible"
                      @blur="handleYearEdit(scope.$index, scope.row)" ref="editYearInput"></el-input>
                    <template v-else>{{ scope.row[item] }}</template>
                  </div>
                  备注信息 
                  <div v-if="scope.row.index == 3">
                    <el-input v-model="yearFormModel.mainteMark"
                      v-if="scope.row.index == yearCoordinate.row && scope.column.index == yearCoordinate.column && scope.column.index !== 0 && inputYearVisible"
                      @blur="handleYearEdit(scope.$index, scope.row)" ref="editYearInput"></el-input>
                    <template v-else>{{ scope.row[item] }}</template>
                  </div>
                </div>

                <div v-else>{{ scope.row[item] }}</div>
              </template>
            </el-table-column>
          </el-table>
        </el-col>
      </el-row> -->
      <!-- <el-dialog title="提示" :visible.sync="dialogVisible" width="30%" :before-close="handleClose">
        <span>添加保养还未完成，是否重新添加其他时间保养</span>
        <span slot="footer" class="dialog-footer">
          <el-button @click="dialogVisible = false">取 消</el-button>
          <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
        </span>
      </el-dialog>-->
    </div>
  </div>
</template>
<script>
import dayjs from "dayjs";
import { getHeadSNSelect, getYearSelect, getHeadSNSearch, getHeadSNMainteData } from '@/network/headSN'
import {
  AddMaintainRecord,
  EditMaintainRecord,
  getSnExists
} from '@/network/headMaintain'

export default {
  name: 'HeadSN',
  components: {
  },
  data() {
    return {
      selectList: [],
      yearList: [],
      data: [],
      year: Number(dayjs().format("YYYY")),
      formModel: {
        headSN: '',
      },
      // 搜索SN
      headSN: '',
      headId: '',
      // 扫描次数
      firstscan: true,
      secondscan: false,
      thirdscan: false,
      showThird: true,
      dialogVisible: false,
      // 表格高亮
      showWeekTableLight: false,
      showMonthTableLight: false,
      showQuarterTableLight: false,
      showYearTableLight: false,
      // input框显示
      inputWeekVisible: false,
      inputMonthVisible: false,
      inputQuarterVisible: false,
      inputYearVisible: false,
      minDay: '',
      addWeekScanObj: {
        mainteDate: '',
        mainteEmpNo: '',
      },
      addMonthScanObj: {
        mainteDate: '',
        mainteEmpNo: '',
      },
      addQuarterScanObj: {
        mainteDate: '',
        mainteEmpNo: '',
      },
      addYearScanObj: {
        mainteDate: '',
        mainteEmpNo: '',
      },
      arrWeekData: [],
      arrMonthData: [],
      arrQuarterData: [],
      arrYearData: [],
      //周
      weekHeaders: [],
      weekValues: [],
      weekMainMark: '',
      weekNextMainteRemainDays: '',
      weekNextMainteDate: '',
      weekFormModel: {
        mainteMark: '',
        mainteEmpNo: '',
        mainteEmpName: '',
        mainteDate: '',
        year: '',
      },
      //月
      monthHeaders: [],
      monthValues: [],
      monthMainMark: '',
      monthNextMainteRemainDays: '',
      monthNextMainteDate: '',
      monthFormModel: {
        mainteMark: '',
        mainteEmpNo: '',
        mainteEmpName: '',
        mainteDate: '',
        year: '',
        // recordId: ''
      },
      //季
      quarterHeaders: [],
      quarterValues: [],
      quarterNextMainteRemainDays: '',
      quarterNextMainteDate: '',
      quarterFormModel: {
        mainteMark: '',
        mainteEmpNo: '',
        mainteEmpName: '',
        mainteDate: '',
        year: '',
      },
      //年
      yearHeaders: [],
      yearValues: [],
      yearNextMainteRemainDays: '',
      yearNextMainteDate: '',
      yearFormModel: {
        mainteMark: '',
        mainteEmpNo: '',
        mainteEmpName: '',
        mainteDate: '',
        year: '',
      },
      page: 1,
      limit: 20,
      count: 0,
      //搜索loading
      loading: false,
      //横纵坐标
      weekCoordinate: { column: -1, row: -1 },
      monthCoordinate: { column: -1, row: -1 },
      quarterCoordinate: { column: -1, row: -1 },
      yearCoordinate: { column: -1, row: -1 },
      monthheaders: [
        {
          prop: 'mainteDate',
          label: '月保养时间',
        },
        {
          prop: 'mainteEmpNo',
          label: '保养员工',
        },
        {
          prop: 'mainteEmpName',
          label: '保养员工姓名',
        },
        {
          prop: 'mainteMark',
          label: '备注信息',
        }
      ],
      quarterheaders: [
        {
          prop: 'mainteDate',
          label: '季保养时间',
        },
        {
          prop: 'mainteEmpNo',
          label: '保养员工',
        },
        {
          prop: 'mainteEmpName',
          label: '保养员工姓名',
        },
        {
          prop: 'mainteMark',
          label: '备注信息',
        }
      ],
      weekheaders: [
        {
          prop: 'mainteDate',
          label: '周保养时间',
        },
        {
          prop: 'mainteEmpNo',
          label: '保养员工',
        },
        {
          prop: 'mainteEmpName',
          label: '保养员工姓名',
        },
        {
          prop: 'mainteMark',
          label: '备注信息',
        }
      ],
      yearheaders: [
        {
          prop: 'mainteDate',
          label: '年保养时间',
        },
        {
          prop: 'mainteEmpNo',
          label: '保养员工',
        },
        {
          prop: 'mainteEmpName',
          label: '保养员工姓名',
        },
        {
          prop: 'mainteMark',
          label: '备注信息',
        }
      ],
    }
  },
  mounted() {
    this.getHeadSNSelectData()
    this.getYearSelectData()
    this.isHeadsn()
    this.getHeadSNTable()
    // 监听按键
    var code = ''
    var lastTime, nextTime // 上次时间、最新时间
    var lastCode, nextCode // 上次按键、最新按键
    document.onkeypress = (e) => {
      // 获取按键
      if (window.event) { // IE
        nextCode = e.keyCode
      } else if (e.which) { // Netscape/Firefox/Opera
        nextCode = e.which
      }
      // 如果触发了回车事件(扫码结束时间)
      if (nextCode === 13) {
        if (code.length < 3) return // 手动输入的时间不会让code的长度大于2，所以这里只会对扫码枪有
        this.codeFind(code) // 获取到扫码枪输入的内容，做别的操作
        code = ''
        lastCode = ''
        lastTime = ''
        return
      }
      nextTime = new Date().getTime() // 记录最新时间
      if (!lastTime && !lastCode) { // 如果上次时间和上次按键为空
        code += e.key // 执行叠加操作
      }
      // 如果有上次时间及上次按键
      if (lastCode && lastTime && nextTime - lastTime > 30) { // 当扫码前有keypress事件时,防止首字缺失
        code = e.key
      } else if (lastCode && lastTime) {
        code += e.key
      }
      lastCode = nextCode
      lastTime = nextTime
    }
  },
  computed: {
    //纵行表头
    getMonthHeaders() {
      return this.arrMonthData.reduce((pre, cur, index) => pre.concat(`value${index}`), ['title'])
    },
    //表头对应的值
    getMonthValues() {
      return this.monthheaders.map(item => {
        return this.arrMonthData.reduce((pre, cur, index) => Object.assign(pre, { ['value' + index]: cur[item.prop] }), { 'title': item.label, });
      });
    },
    getQuarterHeaders() {
      return this.arrQuarterData.reduce((pre, cur, index) => pre.concat(`value${index}`), ['title'])
    },
    getQuarterValues() {
      return this.quarterheaders.map(item => {
        return this.arrQuarterData.reduce((pre, cur, index) => Object.assign(pre, { ['value' + index]: cur[item.prop] }), { 'title': item.label, });
      });
    },
    getWeekHeaders() {
      return this.arrWeekData.reduce((pre, cur, index) => pre.concat(`value${index}`), ['title'])
    },
    getWeekValues() {
      return this.weekheaders.map(item => {
        return this.arrWeekData.reduce((pre, cur, index) => Object.assign(pre, { ['value' + index]: cur[item.prop] }), { 'title': item.label, });
      });
    },
    getYearHeaders() {
      return this.arrYearData.reduce((pre, cur, index) => pre.concat(`value${index}`), ['title'])
    },
    getYearValues() {
      return this.yearheaders.map(item => {
        return this.arrYearData.reduce((pre, cur, index) => Object.assign(pre, { ['value' + index]: cur[item.prop] }), { 'title': item.label, });
      });
    },
  },
  methods: {
    /* handleWeekTableLight(e) {
      //取消触发回车
      let target = e.target
      if (target.nodeName === 'SPAN' || target.nodeName === 'I') {
        target = e.target.parentNode
      }
      target.blur()
      this.showWeekTableLight = true
      this.showMonthTableLight = false
      this.showQuarterTableLight = false
      this.showYearTableLight = false
      this.minDay = 'week'//this.weekNextMainteRemainDays
      this.secondscan = true
      // 没添加完成删除已添加的日期
    //   if (this.addWeekScanObj.mainteDate == dayjs().format("YYYY-MM-DD")) {
      if (this.addWeekScanObj.mainteDate) {
        this.secondscan = false
      }
      // 添加日期
    //   if (this.addMonthScanObj.mainteDate == dayjs().format("YYYY-MM-DD")) {
      if (this.addMonthScanObj.mainteDate) {
        this.arrMonthData.shift()
        this.monthValue()
        this.addMonthScanObj = {}
      }
    //   if (this.addQuarterScanObj.mainteDate == dayjs().format("YYYY-MM-DD")) {
      if (this.addQuarterScanObj.mainteDate) {
        this.arrQuarterData.shift()
        this.quarterValue()
        this.addQuarterScanObj = {}
      }
    //   if (this.addYearScanObj.mainteDate == dayjs().format("YYYY-MM-DD")) {
      if (this.addYearScanObj.mainteDate) {
        this.arrYearData.shift()
        this.yearValue()
        this.addYearScanObj = {}
      }
    }, */
    handleMonthTableLight(e) {
      let target = e.target
      if (target.nodeName === 'SPAN' || target.nodeName === 'I') {
        target = e.target.parentNode
      }
      target.blur()
      this.secondscan = true
      this.showMonthTableLight = true
      this.showWeekTableLight = false
      this.showQuarterTableLight = false
      this.showYearTableLight = false
      this.minDay = 'month'//this.monthNextMainteRemainDays
      //   if (this.addMonthScanObj.mainteDate == dayjs().format("YYYY-MM-DD")) {
      if (this.addMonthScanObj.mainteDate) {
        this.secondscan = false
      }
      //   if (this.addWeekScanObj.mainteDate == dayjs().format("YYYY-MM-DD")) {
      if (this.addWeekScanObj.mainteDate) {
        this.arrWeekData.shift()
        this.weekValue()
        this.addWeekScanObj = {}
      }
      //   if (this.addQuarterScanObj.mainteDate == dayjs().format("YYYY-MM-DD")) {
      if (this.addQuarterScanObj.mainteDate) {
        this.arrQuarterData.shift()
        this.quarterValue()
        this.addQuarterScanObj = {}
      }
      //   if (this.addYearScanObj.mainteDate == dayjs().format("YYYY-MM-DD")) {
      if (this.addYearScanObj.mainteDate) {
        this.arrYearData.shift()
        this.yearValue()
        this.addYearScanObj = {}
      }
    },
    handleQuarterTableLight(e) {
      let target = e.target
      if (target.nodeName === 'SPAN' || target.nodeName === 'I') {
        target = e.target.parentNode
      }
      target.blur()
      this.secondscan = true
      this.showQuarterTableLight = true
      this.showWeekTableLight = false
      this.showMonthTableLight = false
      this.showYearTableLight = false
      this.minDay = 'quarter' //this.quarterNextMainteRemainDays
      //   if (this.addQuarterScanObj.mainteDate == dayjs().format("YYYY-MM-DD")) {
      if (this.addQuarterScanObj.mainteDate) {
        this.secondscan = false
      }
      //   if (this.addWeekScanObj.mainteDate == dayjs().format("YYYY-MM-DD")) {
      if (this.addWeekScanObj.mainteDate) {
        this.arrWeekData.shift()
        this.weekValue()
        this.addWeekScanObj = {}
      }
      //   if (this.addMonthScanObj.mainteDate == dayjs().format("YYYY-MM-DD")) {
      if (this.addMonthScanObj.mainteDate) {
        this.arrMonthData.shift()
        this.monthValue()
        this.addMonthScanObj = {}
      }
      //   if (this.addYearScanObj.mainteDate == dayjs().format("YYYY-MM-DD")) {
      if (this.addYearScanObj.mainteDate) {
        this.arrYearData.shift()
        this.yearValue()
        this.addYearScanObj = {}
      }
    },
    /* handleYearTableLight(e) {
      let target = e.target
      if (target.nodeName === 'SPAN' || target.nodeName === 'I') {
        target = e.target.parentNode
      }
      target.blur()
      this.secondscan = true
      this.showYearTableLight = true
      this.showQuarterTableLight = false
      this.showWeekTableLight = false
      this.showMonthTableLight = false
      this.minDay = 'year' //this.yearNextMainteRemainDays
    //   if (this.addYearScanObj.mainteDate == dayjs().format("YYYY-MM-DD")) {
      if (this.addYearScanObj.mainteDate) {
        this.secondscan = false
      }
    //   if (this.addWeekScanObj.mainteDate == dayjs().format("YYYY-MM-DD")) {
      if (this.addWeekScanObj.mainteDate) {
        this.arrWeekData.shift()
        this.weekValue()
        this.addWeekScanObj = {}
      }
    //   if (this.addMonthScanObj.mainteDate == dayjs().format("YYYY-MM-DD")) {
      if (this.addMonthScanObj.mainteDate) {
        this.arrMonthData.shift()
        this.monthValue()
        this.addMonthScanObj = {}
      }
    //   if (this.addQuarterScanObj.mainteDate == dayjs().format("YYYY-MM-DD")) {
      if (this.addQuarterScanObj.mainteDate) {
        this.arrQuarterData.shift()
        this.quarterValue()
        this.addQuarterScanObj = {}
      }
    }, */
    codeFind(code) {
      console.log(code + '扫描成功');
      if (this.formModel.headSN == '') {
        // 第一次序列号为空查询
        const _headSN = encodeURIComponent(code);
        getSnExists({ headSN: _headSN }).then(res => {
          console.log(res);
          if (res.data) {
            this.formModel.headSN = _headSN
            this.firstscan = false
            this.secondscan = true
            this.handleSearchHeadSN()
          } else {
            this.$message({
              showClose: true,
              duration: 4000,
              message: '无head信息 ' + _headSN,
              type: 'error',
            });
          }
        })
      } else if (encodeURIComponent(code) == this.formModel.headSN && this.secondscan == true) {
        this.secondscan = false
        this.thirdscan = true
        if (this.minDay == 'month') {
          this.addMonthScanObj.mainteDate = dayjs().format("YYYY-MM-DD")
          this.arrMonthData.unshift(this.addMonthScanObj)
          this.monthValue()
          this.showThird = false
        } if (this.minDay == 'week') {
          this.addWeekScanObj.mainteDate = dayjs().format("YYYY-MM-DD")
          this.showThird = false
          this.arrWeekData.unshift(this.addWeekScanObj)
          this.weekValue()
        } if (this.minDay == 'quarter') {
          this.addQuarterScanObj.mainteDate = dayjs().format("YYYY-MM-DD")

          this.showThird = false
          this.arrQuarterData.unshift(this.addQuarterScanObj)
          this.quarterValue()
        }
        if (this.minDay == 'year') {
          this.addYearScanObj.mainteDate = dayjs().format("YYYY-MM-DD")

          this.showThird = false
          this.arrYearData.unshift(this.addYearScanObj)
          this.yearValue()
        }    //第二次扫描不等于第一次扫描序列号 重新搜索当成第一次
      } else if (encodeURIComponent(code) !== this.formModel.headSN && this.thirdscan == false && this.secondscan == true && this.firstscan == false) {
        const _headSN = encodeURIComponent(code);
        getSnExists({ headSN: _headSN }).then(res => {
          if (res.data) {
            this.formModel.headSN = _headSN
            this.handleSearchHeadSN()
          } else {
            this.$message({
              showClose: true,
              duration: 4000,
              message: '无head信息 ' + _headSN,
              type: 'error',
            });
          }
        })    //第三次扫描添加员工姓名
      } else if (encodeURIComponent(code) !== this.formModel.headSN && this.thirdscan == true) {
        if (this.minDay == 'month') {
          this.$set(this.addMonthScanObj, "mainteEmpNo", code)
          this.monthValue()
          AddMaintainRecord({ headSN: this.formModel.headSN, mainteType: 'month', year: this.year, ...this.addMonthScanObj }).then(res => {
            if (res.status !== 200) {
              return;
            }
            // this.formModel.headSN = ''
            this.$set(this.addMonthScanObj, "recordId", res.data.recordId)
            this.monthNextMainteRemainDays = res.data.nextRemainDays
            this.thirdscan = false
            this.secondscan = false
            this.showThird = true
            this.addMonthScanObj = {}
            this.$message({
              showClose: true,
              message: '添加成功',
              type: 'success'
            });
          }).catch(error => {
            this.$message({
              showClose: true,
              message: '添加失败',
              duration: 4000,
              type: 'error'
            });
          })
        } if (this.minDay == 'week') {
          this.$set(this.addWeekScanObj, "mainteEmpNo", code)
          this.weekValue()
          AddMaintainRecord({ headSN: this.formModel.headSN, mainteType: 'week', year: this.year, ...this.addWeekScanObj }).then(res => {
            if (res.status !== 200) {
              return;
            }
            // this.formModel.headSN = ''
            this.$set(this.addWeekScanObj, "recordId", res.data.recordId)
            this.weekNextMainteRemainDays = res.data.nextRemainDays
            this.thirdscan = false
            this.secondscan = false
            this.showThird = true
            this.addWeekScanObj = {}
            this.$message({
              showClose: true,
              message: '添加成功',
              type: 'success'
            });
          }).catch(error => {
            this.$message({
              showClose: true,
              message: '添加失败',
              duration: 4000,
              type: 'error'
            });
          })
        }
        if (this.minDay == 'quarter') {
          this.$set(this.addQuarterScanObj, "mainteEmpNo", code)
          this.quarterValue()
          AddMaintainRecord({ headSN: this.formModel.headSN, mainteType: 'quarter', year: this.year, ...this.addQuarterScanObj }).then(res => {
            if (res.status !== 200) {
              return;
            }
            // this.formModel.headSN = ''
            this.$set(this.addQuarterScanObj, "recordId", res.data.recordId)
            this.quarterNextMainteRemainDays = res.data.nextRemainDays
            this.thirdscan = false
            this.secondscan = false
            this.showThird = true
            this.addQuarterScanObj = {}
            this.$message({
              showClose: true,
              message: '添加成功',
              type: 'success'
            });
          }).catch(error => {
            this.$message({
              showClose: true,
              message: '添加失败',
              duration: 4000,
              type: 'error'
            });
          })
        }
        if (this.minDay == 'year') {
          this.$set(this.addYearScanObj, "mainteEmpNo", code)
          this.yearValue()
          AddMaintainRecord({ headSN: this.formModel.headSN, mainteType: 'year', year: this.year, ...this.addYearScanObj }).then(res => {
            if (res.status !== 200) {
              return;
            }
            // this.formModel.headSN = ''
            this.$set(this.addYearScanObj, "recordId", res.data.recordId)
            this.yearNextMainteRemainDays = res.data.nextRemainDays
            this.thirdscan = false
            this.secondscan = false
            this.showThird = true
            this.addYearScanObj = {}
            this.$message({
              showClose: true,
              message: '添加成功',
              type: 'success'
            });
          }).catch(error => {
            this.$message({
              showClose: true,
              message: '添加失败',
              duration: 4000,
              type: 'error'
            });
          })
        }
        // 如果第二次和第三次扫描相同的序列号提示扫正确的员工号
      } else if (encodeURIComponent(code) == this.formModel.headSN && this.showThird == false) {
        this.$message({
          showClose: true,
          message: '请扫描正确的员工码',
          duration: 4000,
          type: 'error'
        });
      }
    },
    isHeadsn() {
      console.log("this.$route", this.$route);
      if (this.$route.query.headSN) {
        if (this.formModel.headSN != this.$route.query.headSN) {
          this.formModel.headSN = this.$route.query.headSN,
            this.secondscan = true
          this.handleSearchHeadSN()
        }
      }
    },
    async getHeadSNTable() {
      try {
        if (!this.formModel.headSN) return;
        const res = await getHeadSNMainteData({ headSN: this.formModel.headSN, year: this.year })
        console.log(res);
        if (!res.data) {
          this.$alert('当前HeadSN不存在，请先在Head维护信息里面添加后再登记保养', '提示', {
            confirmButtonText: '确定'
          });
          this.headId = 0;
          this.headSN = '';
          this.formModel.headSN = '';
          return;
        }
        this.headId = res.data.headId
        // this.headSN = res.data.headSN
        this.monthNextMainteDate = res.data.monthMainteInfo.nextMainteDate
        this.monthNextMainteRemainDays = res.data.monthMainteInfo.nextMainteRemainDays

        this.quarterNextMainteDate = res.data.quarterMainteInfo.nextMainteDate
        this.quarterNextMainteRemainDays = res.data.quarterMainteInfo.nextMainteRemainDays

        this.weekNextMainteDate = res.data.weekMainteInfo.nextMainteDate
        this.weekNextMainteRemainDays = res.data.weekMainteInfo.nextMainteRemainDays

        this.yearNextMainteDate = res.data.yearMainteInfo.nextMainteDate
        this.yearNextMainteRemainDays = res.data.yearMainteInfo.nextMainteRemainDays

        this.arrWeekData = res.data.weekMainteInfo.data
        this.arrMonthData = res.data.monthMainteInfo.data
        this.arrQuarterData = res.data.quarterMainteInfo.data
        this.arrYearData = res.data.yearMainteInfo.data

        const currMinDay = Math.min(
          // this.weekNextMainteRemainDays,
          this.monthNextMainteRemainDays,
          this.quarterNextMainteRemainDays,
          //   this.yearNextMainteRemainDays
        )
        // this.$nextTick(() => {
        //   let div = document.querySelector(".weekheight");
        //   console.log(div.offsetHeight);
        //   console.log(div);
        // })
        /* if (currMinDay == this.weekNextMainteRemainDays) {
          this.showWeekTableLight = true
          this.showMonthTableLight = false
          this.showQuarterTableLight = false
          this.showYearTableLight = false
          this.minDay='week'
        } else  */
        if (currMinDay == this.monthNextMainteRemainDays) {
          this.showMonthTableLight = true
          this.showWeekTableLight = false
          this.showQuarterTableLight = false
          this.showYearTableLight = false
          this.minDay = 'month'
        } else if (currMinDay == this.quarterNextMainteRemainDays) {
          this.showQuarterTableLight = true
          this.showWeekTableLight = false
          this.showMonthTableLight = false
          this.showYearTableLight = false
          this.minDay = 'quarter'
        }
        /* else if (currMinDay == this.yearNextMainteRemainDays) {
          this.showYearTableLight = true
          this.showWeekTableLight = false
          this.showMonthTableLight = false
          this.showQuarterTableLight = false
          this.minDay = 'year'
        } */
        this.monthValue()
        this.quarterValue()
        /* this.weekValue()
        this.yearValue() */
      } catch (error) {
        console.log(error);
      }
    },
    //weekValue转换
    weekValue() {
      this.weekHeaders = this.getWeekHeaders
      this.weekValues = this.getWeekValues
    },
    //monthvalue转换
    monthValue() {
      this.monthHeaders = this.getMonthHeaders
      this.monthValues = this.getMonthValues
    },
    //quartervalue转换
    quarterValue() {
      this.quarterHeaders = this.getQuarterHeaders
      this.quarterValues = this.getQuarterValues
    },
    //yearValue转换
    yearValue() {
      this.yearHeaders = this.getYearHeaders
      this.yearValues = this.getYearValues
    },
    async getHeadSNSelectData() {
      try {
        // const res = await getHeadSNSelect({ page: this.page, limit: this.limit })
        const res = await getHeadSNSearch({ page: this.page, limit: this.limit })
        this.selectList = res.data
        this.count = res.count
      } catch (error) {
        console.log(error);
      }
    },
    async getYearSelectData() {
      try {
        const res = await getYearSelect()
        let obj = {};
        for (let key in res.data) {
          obj[key] = res.data[key];
        };
        this.yearList = Object.keys(obj).map(val => ({
          label: obj[val],
          value: val,
        }));
      } catch (error) {
        console.log(error);
      }
    },
    //搜索序列号记录
    handleSearchHeadSN() {
      this.getHeadSNTable()
    },
    handleSearchHeadSN1() {
      this.formModel.headSN = this.headSN
      this.getHeadSNTable()
      //   this.formModel.headSN = ''
    },
    //下拉框搜索
    filterHeadSN(query) {
      this.loading = true
      this.formModel.headSN = query
      setTimeout(() => {
        this.loading = false
        this.searchHeadSN()
      }, 200);
    },
    async searchHeadSN() {
      try {
        const res = await getHeadSNSearch({ fuzzySNPart: this.formModel.headSN, page: this.page, limit: this.limit })
        this.count = res.count
        this.page = res.page
        this.limit = res.limit
        this.selectList = res.data
      } catch (error) {
        console.log(error);
      }
    },
    handleSizeChange(val) {
      this.limit = val;
      this.getHeadSNSelectData()
    },
    handleCurrentChange(val) {
      this.page = val;
      this.getHeadSNSelectData()
    },
    getBgStyle(isLinght, deep) {
      if (isLinght) {
        if (deep) {
          return 'background:rgb(167 238 127)';
        }
        else {
          return 'background:#f0f9eb';
        }
      }
      else {
        // return 'background:none';
        return '';
      }
    },
    getBgStyleClass(isLinght) {
      if (isLinght) {
        return 'selected-bgcolor';
      }
      else {
        return '';
      }
    },
    cellWeekStyleEvent(index) {
      if (index.columnIndex == 0) {
        return { background: this.showWeekTableLight ? 'rgb(167 238 127)' : '#eef1f6', color: '#606266', fontWeight: 700 }
      }
      if (index.columnIndex !== 0) {
        if (this.showWeekTableLight) {
          return { background: '#f0f9eb', }
        } else {
          return { background: '' }
        }
      }
    },
    cellMonthStyleEvent(index) {
      if (index.columnIndex == 0) {
        return { background: this.showMonthTableLight ? 'rgb(167 238 127)' : '#eef1f6', color: '#606266', fontWeight: 700 }
      }
      if (index.columnIndex !== 0) {
        if (this.showMonthTableLight) {
          return { background: '#f0f9eb', }
        } else {
          return { background: '' }
        }
      }

    },
    cellQuarterStyleEvent(index) {
      if (index.columnIndex == 0) {
        return { background: this.showQuarterTableLight ? 'rgb(167 238 127)' : '#eef1f6', color: '#606266', fontWeight: 700 }
      }
      if (index.columnIndex !== 0) {
        if (this.showQuarterTableLight) {
          return { background: '#f0f9eb' }
        } else {
          return { background: '' }
        }
      }
    },
    cellYearStyleEvent(index) {
      if (index.columnIndex == 0) {
        return { background: this.showYearTableLight ? 'rgb(167 238 127)' : '#eef1f6', color: '#606266', fontWeight: 700 }
      }
      if (index.columnIndex !== 0) {
        if (this.showYearTableLight) {
          return { background: '#f0f9eb' }
        } else {
          return { background: '' }
        }
      }
    },
    tableCellClassName({ row, column, rowIndex, columnIndex }) {
      //利用单元格的 className 的回调方法，给行列索引赋值
      row.index = rowIndex;
      column.index = columnIndex;
    },
    /* cellWeekClick(row, column, cell, event) {
      if (row.index == 0 && column.index !== 0 || row.index == 1 && column.index !== 0 || 
            row.index == 2 && column.index !== 0 || row.index == 3 && column.index !== 0) {
        this.weekCoordinate.row = row.index;
        this.weekCoordinate.column = column.index;
        // 给行加索引
        row.column = column.index
        // 自动聚焦
        if (this.showWeekTableLight) {
          this.inputWeekVisible = true
          this.$nextTick(() => {
            this.$refs['editWeekInput'][0].focus()
            console.log(this.$refs['editWeekInput'])
            //input框的值为第一次获取到的值
            this.weekFormModel.mainteDate = this.arrWeekData[row.column - 1].mainteDate
            this.weekFormModel.mainteMark = this.arrWeekData[row.column - 1].mainteMark
            this.weekFormModel.mainteEmpNo = this.arrWeekData[row.column - 1].mainteEmpNo
            this.weekFormModel.mainteEmpName = this.arrWeekData[row.column - 1].mainteEmpName
          })
        }
      }
    }, */
    cellMonthClick(row, column, cell, event) {
      if (row.index == 0 && column.index !== 0 || row.index == 1 && column.index !== 0 ||
        row.index == 2 && column.index !== 0 || row.index == 3 && column.index !== 0) {
        this.monthCoordinate.row = row.index;
        this.monthCoordinate.column = column.index;
        // 给行加索引
        row.column = column.index
        // 自动聚焦
        if (this.showMonthTableLight) {
          this.inputMonthVisible = true
          this.$nextTick(() => {
            this.$refs['editInput'][0].focus()
            //input框的值为第一次获取到的值
            this.monthFormModel.mainteDate = this.arrMonthData[row.column - 1].mainteDate
            this.monthFormModel.mainteMark = this.arrMonthData[row.column - 1].mainteMark
            this.monthFormModel.mainteEmpNo = this.arrMonthData[row.column - 1].mainteEmpNo
            this.monthFormModel.mainteEmpName = this.arrMonthData[row.column - 1].mainteEmpName

          })
        }
      }
    },
    cellQuarterClick(row, column) {
      if (row.index == 0 && column.index !== 0 || row.index == 1 && column.index !== 0 ||
        row.index == 2 && column.index !== 0 || row.index == 3 && column.index !== 0) {
        this.quarterCoordinate.row = row.index;
        this.quarterCoordinate.column = column.index;
        // 给行加索引
        row.column = column.index
        // 自动聚焦
        if (this.showQuarterTableLight) {
          this.inputQuarterVisible = true
          this.$nextTick(() => {
            this.$refs['editQuarterInput'][0].focus()
            //input框的值为第一次获取到的值
            this.quarterFormModel.mainteDate = this.arrQuarterData[row.column - 1].mainteDate
            this.quarterFormModel.mainteMark = this.arrQuarterData[row.column - 1].mainteMark
            this.quarterFormModel.mainteEmpNo = this.arrQuarterData[row.column - 1].mainteEmpNo
            this.quarterFormModel.mainteEmpName = this.arrQuarterData[row.column - 1].mainteEmpName
          })
        }

      }
    },
    /* cellYearClick(row, column) {
      if (row.index == 0 && column.index !== 0 || row.index == 1 && column.index !== 0 || 
            row.index == 2 && column.index !== 0 || row.index == 3 && column.index !== 0) {
        this.yearCoordinate.row = row.index;
        this.yearCoordinate.column = column.index;
        // 给行加索引
        row.column = column.index
        // 自动聚焦
        if (this.showYearTableLight) {
          this.inputYearVisible = true
          this.$nextTick(() => {
            this.$refs['editYearInput'][0].focus()
            //input框的值为第一次获取到的值
            this.yearFormModel.mainteDate = this.arrYearData[row.column - 1].mainteDate
            this.yearFormModel.mainteMark = this.arrYearData[row.column - 1].mainteMark
            this.yearFormModel.mainteEmpNo = this.arrYearData[row.column - 1].mainteEmpNo
            this.yearFormModel.mainteEmpName = this.arrYearData[row.column - 1].mainteEmpName
          })
        }

      }
    }, */
    //周编辑
    handleWeekEdit(index, row) {
      console.log("index".index)
      //input框消失
      this.weekCoordinate = { column: -1, row: -1 }
      this.inputWeekVisible = false
      //发起请求一开始的值双向绑定input的值
      this.arrWeekData[row.column - 1].mainteMark = this.weekFormModel.mainteMark
      this.arrWeekData[row.column - 1].mainteEmpNo = this.weekFormModel.mainteEmpNo
      this.arrWeekData[row.column - 1].mainteEmpName = this.weekFormModel.mainteEmpName
      this.arrWeekData[row.column - 1].mainteDate = this.weekFormModel.mainteDate
      this.weekFormModel = { ...this.arrWeekData[row.column - 1] }
      //年份绑定下拉框的值，下拉框一开始默认当前年份
      this.weekFormModel.year = this.year
      EditMaintainRecord(this.weekFormModel).then(res => {
        // 还原到Edit  AddMaintainRecord({ ...this.weekFormModel,mainteType:'week', headSN: this.formModel.headSN }).then(res => {
        //input框的值绑定获取到的备注
        if (res.status !== 200) {
          // 保存失败，应还原值
          return;
        }
        this.weekNextMainteRemainDays = res.data.nextRemainDays
        this.weekFormModel.mainteMark = res.data.mainteMark
        this.weekFormModel.mainteEmpNo = res.data.mainteEmpNo
        this.weekFormModel.mainteEmpName = res.data.mainteEmpName
        this.weekFormModel.mainteDate = res.data.mainteDate
        //表格备注等于新增获取到的备注
        this.arrWeekData[row.column - 1].mainteMark = res.data.mainteMark
        this.arrWeekData[row.column - 1].mainteEmpNo = res.data.mainteEmpNo
        this.arrWeekData[row.column - 1].mainteEmpName = res.data.mainteEmpName
        this.arrWeekData[row.column - 1].mainteDate = res.data.mainteDate
        this.weekValue()
      }).catch(err => {
        console.log(err);
      })
    },
    //月编辑
    handleMonthEdit(index, row) {
      //input框消失
      this.monthCoordinate = { column: -1, row: -1 }
      this.inputMonthVisible = false
      //发起请求一开始的值双向绑定input的值
      this.arrMonthData[row.column - 1].mainteMark = this.monthFormModel.mainteMark
      this.arrMonthData[row.column - 1].mainteEmpNo = this.monthFormModel.mainteEmpNo
      this.arrMonthData[row.column - 1].mainteEmpName = this.monthFormModel.mainteEmpName
      this.arrMonthData[row.column - 1].mainteDate = this.monthFormModel.mainteDate
      this.monthFormModel = { ...this.arrMonthData[row.column - 1] }
      //年份绑定下拉框的值，下拉框一开始默认当前年份
      this.monthFormModel.year = this.year
      EditMaintainRecord(this.monthFormModel).then(res => {
        //   AddMaintainRecord({ ...this.monthFormModel, mainteType:'month', headSN: this.formModel.headSN, }).then(res => {
        //input框的值绑定获取到的备注
        if (res.status !== 200) {
          return;
        }
        this.monthNextMainteRemainDays = res.data.nextRemainDays
        this.monthFormModel.mainteMark = res.data.mainteMark
        this.monthFormModel.mainteEmpNo = res.data.mainteEmpNo
        this.monthFormModel.mainteEmpName = res.data.mainteEmpName
        this.monthFormModel.mainteDate = res.data.mainteDate
        //表格备注等于新增获取到的备注
        this.arrMonthData[row.column - 1].mainteMark = res.data.mainteMark
        this.arrMonthData[row.column - 1].mainteEmpNo = res.data.mainteEmpNo
        this.arrMonthData[row.column - 1].mainteEmpName = res.data.mainteEmpName
        this.arrMonthData[row.column - 1].mainteDate = res.data.mainteDate
        this.monthValue()
      }).catch(err => {
        console.log(err);
      })
    },
    //季编辑
    handleQuarterEdit(index, row) {
      //input框消失
      this.quarterCoordinate = { column: -1, row: -1 }
      this.inputQuarterVisible = false
      //发起请求一开始的值双向绑定input的值
      this.arrQuarterData[row.column - 1].mainteMark = this.quarterFormModel.mainteMark
      this.arrQuarterData[row.column - 1].mainteEmpNo = this.quarterFormModel.mainteEmpNo
      this.arrQuarterData[row.column - 1].mainteEmpName = this.quarterFormModel.mainteEmpName
      this.arrQuarterData[row.column - 1].mainteDate = this.quarterFormModel.mainteDate
      this.quarterFormModel = { ...this.arrQuarterData[row.column - 1] }
      //年份绑定下拉框的值，下拉框一开始默认当前年份
      this.quarterFormModel.year = this.year
      EditMaintainRecord(this.quarterFormModel).then(res => {
        //   AddMaintainRecord({ ...this.quarterFormModel,mainteType:'quarter', headSN: this.formModel.headSN, }).then(res => {
        if (res.status !== 200) {
          return;
        }
        //input框的值绑定获取到的备注
        this.quarterNextMainteRemainDays = res.data.nextRemainDays
        this.quarterFormModel.mainteMark = res.data.mainteMark
        this.quarterFormModel.mainteEmpNo = res.data.mainteEmpNo
        this.quarterFormModel.mainteEmpName = res.data.mainteEmpName
        this.quarterFormModel.mainteDate = res.data.mainteDate
        //表格备注等于新增获取到的备注
        this.arrQuarterData[row.column - 1].mainteMark = res.data.mainteMark
        this.arrQuarterData[row.column - 1].mainteEmpNo = res.data.mainteEmpNo
        this.arrQuarterData[row.column - 1].mainteEmpName = res.data.mainteEmpName
        this.arrQuarterData[row.column - 1].mainteDate = res.data.mainteDate
        this.quarterValue()
      }).catch(err => {
        console.log(err);
      })
    },
    //年编辑
    handleYearEdit(index, row) {
      //input框消失
      this.yearCoordinate = { column: -1, row: -1 }
      this.inputYearVisible = false
      //发起请求一开始的值双向绑定input的值
      this.arrYearData[row.column - 1].mainteMark = this.yearFormModel.mainteMark
      this.arrYearData[row.column - 1].mainteEmpNo = this.yearFormModel.mainteEmpNo
      this.arrYearData[row.column - 1].mainteEmpName = this.yearFormModel.mainteEmpName
      this.arrYearData[row.column - 1].mainteDate = this.yearFormModel.mainteDate
      this.yearFormModel = { ...this.arrYearData[row.column - 1] }
      //年份绑定下拉框的值，下拉框一开始默认当前年份
      this.yearFormModel.year = this.year
      EditMaintainRecord(this.yearFormModel).then(res => {
        //   EditYearMaintain({ ...this.yearFormModel,mainteType:'year', headSN: this.formModel.headSN, }).then(res => {
        if (res.status !== 200) {
          return;
        }
        //input框的值绑定获取到的备注
        this.yearNextMainteRemainDays = res.data.nextRemainDays
        this.yearFormModel.mainteMark = res.data.mainteMark
        this.yearFormModel.mainteEmpNo = res.data.mainteEmpNo
        this.yearFormModel.mainteEmpName = res.data.mainteEmpName
        this.yearFormModel.mainteDate = res.data.mainteDate
        //表格备注等于新增获取到的备注
        this.arrYearData[row.column - 1].mainteMark = res.data.mainteMark
        this.arrYearData[row.column - 1].mainteEmpNo = res.data.mainteEmpNo
        this.arrYearData[row.column - 1].mainteEmpName = res.data.mainteEmpName
        this.arrYearData[row.column - 1].mainteDate = res.data.mainteDate

        this.yearValue()
      }).catch(err => {
        console.log(err);
      })
    },
    // 新增月保养表格[未使用]
    handleAddMonth() {
      if (this.secondscan) {
        this.addScanObj.mainteDate = dayjs().format("YYYY-MM-DD")
        this.secondscan = false
        this.arrMonthData.push(this.addScanObj)
      } else {
        // this.addScanObj.mainteEmpNo = 1
        this.secondscan = true
        this.$set(this.addScanObj, "mainteEmpNo", 1)
        this.monthNextMainteDate = this.$set(this.arrMonthData[1], 'nextMainteDate', dayjs().add(1, 'year').format("YYYY-MM-DD"))


        this.$set(this.addScanObj, "id", 2)
        this.addScanObj = {}

      }
      this.monthValue()
    }
  }
}
</script>
<style scoped>
.container div {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 191px;
  background-color: #eef1f6;
  color: #606266;
  font-weight: 700;
}

.mainteDay {
  height: 191px;
  background-color: #eef1f6;
  color: #606266;
  font-weight: 700;
  text-align: center;
}

.mainteDay1 {
  padding-top: 70px;
  padding-bottom: 15px;
}

.button {
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 191px;
}

.headsn {
  font-size: 16px;
  color: #606266;
  font-weight: 700;
  margin: 0 1em;
}

.HeadSN {
  font-size: 16px;
  margin-bottom: 10px;
}

.selected-bgcolor {
  background: #f0f9eb
}
</style>